<template>
  <div>
    <div>
      <!-- 聊天主界面:显示群 -->
      <form action="/">
        <!-- v-model="value" -->
        <van-search
          show-action
          placeholder="请输入搜索关键词" />
      </form>
      <chathomeitem-com class="van-hairline--surround"
                        v-for="(item, index) in groupList"
                        :chatitem="item"
                        :key="index">
        <div style="padding:5px;"
             @click="gotolink(index)">
          {{item.groupname}}<br>
          {{ item.currentcontent }}<br>
        </div>
      </chathomeitem-com>
    </div>
  </div>
</template>

<script>
import chathomeitemCom from './ChathomeItem'

export default {
  components: {
    chathomeitemCom
  },
  data () {
    return {
      // 群数组
      groupList: this.$store.state.groupList
    }
  },
  methods: {
    // 跳转and利用router.push的query传递参数
    gotolink (index) {
      this.$router.push({ path: 'chatcom', query: { index: index } })
    }
  }
}
</script>

<style scoped>
#chatitem {
  height: 40px;
  margin-bottom: 1px;
  border-bottom: 1px solid gray;
  font-size: 10px;
}
#memberitem {
  height: 40px;
  font-size: 18px;
}
.van-hairline--surround {
  padding-left: 3%;
  padding-right: 3%;
}
</style>
